<template>
  <div class="Devicesetdetail">
    <ol>
      <li>栏目名称</li>
      <li>ID</li>
      <li>值</li>
      <li>操作</li>
    </ol>
    <div class="Wrapcotent">
      <template v-for="item in detailList">
        <ul>
          <li>{{item.name}}</li>
          <li>{{item.id}}</li>
          <li v-show="false">{{item.value}}</li>
          <li :id="item.id"></li>
          <li>
            <template v-if="item.operations == 'R' ">
              <el-button size="small" type="primary" @click="readBtn(item,$event)">读取</el-button>
            </template>
            <template v-else-if="item.operations == 'RW' ">
              <el-button size="small" type="primary" @click="readBtn(item,$event)">读取</el-button>
              <el-button size="small" type="primary" @click="writerBtn(item,$event)">写入</el-button>
            </template>
            <template v-else-if="item.operations == 'W' ">
              <el-button size="small" type="primary" @click="writerBtn(item,$event)">写入</el-button>
            </template>
          </li>
        </ul>
      </template>
    </div>
    <section class="dialogSec" v-bind:class="{'dialogshow' : handleDialog}">
      <el-form size="mini" label-position="right" :model="form">
        <section class="title">
          <h3>{{deviceName}}</h3>
          <i class="el-icon-close" @click="handleDialog = false"></i>
        </section>
        <section class="top">
          <el-form-item label="写入值" :label-width="formLabelWidth">
            <el-input type="text" v-model="form.value" placeholder="请输入要写入的值"></el-input>
          </el-form-item>
        </section>
        <section class="foot">
          <div slot="footer" class="dialog-footer">
            <el-button size="mini" @click="handleDialog = false">取 消</el-button>
            <el-button size="mini" type="primary" @click="sureBtn">确 定</el-button>
          </div>
        </section>
      </el-form>
    </section>
  </div>
</template>

<script type="text/javascript" src="../../../api/devicemg/suballdevice/devicesetdetail.js"></script>

<style lang="scss">
.Devicesetdetail {
  > section {
    &.dialogSec {
      .el-form {
        .top {
          margin-left: -13% !important;
        }
      }
    }
  }
}
</style>
